<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@taglib prefix="s" uri="/struts-tags" %>
<%
	String contextPath = request.getContextPath();
%>
<html>
<head>
<link rel="stylesheet" href="<%=contextPath%>/include/css/themes/base/jquery.ui.all.css">
<link href="style/store.css" rel="stylesheet" type="text/css">
<script src="<%=contextPath%>/include/js/jquery-1.5.1.js"></script>
<script src="<%=contextPath%>/include/js/external/jquery.bgiframe-2.1.2.js"></script>
<script src="<%=contextPath%>/include/js/ui/jquery.ui.core.js"></script>
<script src="<%=contextPath%>/include/js/ui/jquery.ui.widget.js"></script>
<script src="<%=contextPath%>/include/js/ui/jquery.ui.mouse.js"></script>
<script src="<%=contextPath%>/include/js/ui/jquery.ui.draggable.js"></script>
<script src="<%=contextPath%>/include/js/ui/jquery.ui.position.js"></script>
<script src="<%=contextPath%>/include/js/ui/jquery.ui.resizable.js"></script>
<script src="<%=contextPath%>/include/js/ui/jquery.ui.dialog.js"></script>
<script src="<%=contextPath%>/include/js/validatorNumericAndBackslash.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title></title>

<SCRIPT type="text/javascript">
	function onLoadInit(){
		document.getElementById("blah").focus();
		var isreceipt = document.getElementById("isreceipt").value;
		if(isreceipt == '1'){
			window.open("receiptWindow.action");
		}
		var xcash = document.form1.cash.value;
		if(xcash != null){
			document.getElementById("cash1").value=xcash;
		}
		
	}
	
	function submitProduct(e,barcode){
		if(e.keyCode == 13 || e == "submit"){
			document.form1.barcode.value=barcode.value;
			document.form1.task.value="addToCartAction";
			document.form1.action="addToCartAction";
			document.form1.submit();
		}
	}
	
	function getQnt(qnt,e,barcode,task){
		if(e.keyCode == 13){
		document.form1.quantity.value=qnt.value;
		document.form1.barcode.value=barcode;
		document.form1.task.value=task;
		document.form1.action="changeQuantityAction";
		document.form1.submit();		
		}
	}
	
	function getChange (cash, e){
		if(e.keyCode == 13){
			document.form1.cash.value=cash.value;
			document.form1.action="getChangeAction";
			document.form1.submit();
		}
	}
	
	function setSearchProduct(){
		window.open('setSearchProductAction.action', 'Search', config='toolbar=no, scrollbars=yes, location=no, directories=no, status=no');
	}
	
	function addProduct(){
		barcode = document.getElementById("blah");
		submitProduct("submit",barcode);
	}
	
	function sellPrintProducts(){
        document.form1.action="sellPrintProductWAction";
        document.form1.submit();
	}
	
	function setupOrderProducts(){
		window.open("selectCustomerForOrderAction");
	}
	
	function orderProducts(customer_id){
		document.getElementById("customer_id").value=customer_id;
		document.form1.action="forOrderProductsAction";
        document.form1.submit();
	}
	
	function resetCart(){
		if(confirm("Reset Product Cart?")){
			document.form1.action="resetCartAction";
			document.form1.submit();
		}else{
			return false;
		}
	}
		
</SCRIPT>

</head>
<body onload="onLoadInit();">
	<table align="center">
		<tr><td>
			<span class="messagetext" >
				<s:actionerror/>
				<s:actionmessage/>
			</span>
		</td></tr>
	</table>
	<table align="center">
		<tr bgcolor="#e8ecf0" style="font-size: 11px; font-family: Arial, Helvetica, sans-serif" >
			<td>Barcode: <input type="text" name="blah" id="blah" onkeyup="submitProduct(event,this);" onkeypress="return checkKeyPressedNumbersOnly(event);"  />
				<input type="button" class="button" onclick="setSearchProduct();" value="..." size="4" />
			</td>
		</tr>
	</table>
	
	<s:form name="form1" method="post" action="#" >
	
	<input name="prodId" type="hidden" />
	<input name="barcode" type="hidden" />
	<input name="quantity" type="hidden" />
	<input name="task" type="hidden" />
	<s:hidden name="cash" id="cash" />
	<s:hidden name="isreceipt" id="isreceipt" />
	<s:hidden name="isreceipt" id="isreceipt" />
	<s:hidden name="customer_id" id="customer_id" />
	
	</s:form>
	
	<table border="1" align="center" width="60%">
		<tr>
			<td align="right" > <input type="button" accesskey="x" onclick="resetCart();" class="button" value="Reset Cart" > </td>
			<td align="center" > <input type="button" accesskey="o" onclick="setupOrderProducts();" class="button" value="For Order" > </td>
			<td align="center" > <input type="button" accesskey="s" onclick="sellPrintProducts();" class="button" value="Sell/Print Receipt" > </td>
		</tr>
		<tr>
			<td colspan="4" class="verdana" height="30" align="center" bgcolor="#336699"><font color="#ffffff">Product Cart</td>
		</tr>
		<tr bgcolor="#e8ecf0" style="font-size: 11px; font-family: Arial, Helvetica, sans-serif" >
			<td width="45%">Product Name</td>
			<td width="20%">Unit Price</td>
			<td width="20%">Unit(s)</td>
			<td width="15%">Sub Total</td>
		</tr>
		<s:if test="#session.productDTOList != null">
		<s:iterator value="#session.productDTOList">
			<tr bgcolor="#e8ecf0" style="font-size: 11px; font-family: Arial, Helvetica, sans-serif" >	
				<td><s:property value="value.name"/></td>
				<td><s:property value="value.price"/></td>
				<td>
					<input name="blah1"  onkeypress="return checkKeyPressedNumbersOnly(event);" onclick="this.select();" onkeyup="getQnt(this,event,<s:property value='value.barcode'/>,'changeQuantityAction');" type="text" size="3" value="<s:property value='value.quantity'/>" />
				</td>				
				<td><s:property value="value.totalPriceString"/></td>
			</tr>
		</s:iterator>	
			<tr bgcolor="#e8ecf0" style="font-size: 11px; font-family: Arial, Helvetica, sans-serif" >
				<td align="right" colspan="4">Cash: <input type="text" name="cash1" id="cash1" value="#session.cash" onkeypress="return checkKeyPressedNumbersOnlyAndPeriod(event);" onclick="this.select();" onkeyup="getChange(this,event);"  size="10" />  </td>
			</tr>
			<tr>
				<td align="right" colspan="4">Loyalty Card Number: <input type="text" onblur=""></td>
			</tr>
			<tr bgcolor="#e8ecf0" style="font-size: 11px; font-family: Arial, Helvetica, sans-serif" >
				<td align="right" colspan="4">Grand Total: <s:property value="grandTotal"/>  </td>
			</tr>
			<tr bgcolor="#e8ecf0" style="font-size: 11px; font-family: Arial, Helvetica, sans-serif" >
				<td align="right" colspan="4">Amount Change: <s:property value="amountchange"/>  </td>
			</tr>	
		</s:if>	
		<s:else>
			<tr bgcolor="#e8ecf0" style="font-size: 11px; font-family: Arial, Helvetica, sans-serif" >
				<td colspan="4">No Product to display</td>
			</tr>
		</s:else>		
	</table>
	 

</body>
</html>